<template>
    <div class="app-org-select">
        <ibiz-select-tree
            :NodesData="NodesData"
            v-model="selectTreeValue"
            :disabled="disabled"
            :multiple="multiple"
            @select="treeSelectChange"
        ></ibiz-select-tree>
    </div>
</template>
<script lang="ts">
import { Vue, Component, Prop, Watch } from 'vue-property-decorator';
import { Http } from '@/utils';
@Component({})
export default class AppOrgSelect extends Vue {
    /**
     * 表单数据
     *
     * @memberof AppOrgSelect
     */
    @Prop() public data!: any;

    /**
     * 上下文
     *
     * @memberof AppOrgSelect
     */
    @Prop() public context!: any;

    /**
     * 填充对象
     *
     * @memberof AppOrgSelect
     */
    @Prop() public fillMap: any;

    /**
     * 过滤项
     *
     * @memberof AppOrgSelect
     */
    @Prop() public filter?: string;

    /**
     * 是否多选
     *
     * @memberof AppOrgSelect
     */
    @Prop({ default: false }) public multiple?: boolean;

    /**
     * 是否禁用
     *
     * @type {*}
     * @memberof AppDepartmentSelect
     */
    @Prop({ default: false }) public disabled?: boolean;

    /**
     * 查询单位路径
     *
     * @memberof AppOrgSelect
     */
    @Prop() public url!: string;

    /**
     * 监听表单数据变化
     *
     * @memberof AppOrgSelect
     */
    @Watch('data', { immediate: true, deep: true })
    onDataChange(newVal: any, oldVal: any) {
        if (newVal) {
            this.computedSelectedData();
            if (this.filter) {
                let tempFilterValue: any = this.initBasicData();
                // filter值变化才去请求数据
                if (tempFilterValue && this.copyFilterValue !== tempFilterValue) {
                    this.loadTreeData(this.url.replace('${orgid}', tempFilterValue));
                    this.copyFilterValue = tempFilterValue;
                }
            }
        }
    }

    /**
     * 选择值
     *
     * @memberof AppOrgSelect
     */
    public selectTreeValue: any = '';

    /**
     * 树节点数据
     *
     * @memberof AppOrgSelect
     */
    public NodesData: any = [];

    /**
     * 备份过滤值
     *
     * @memberof AppOrgSelect
     */
    public copyFilterValue: any;

    /**
     * vue生命周期
     *
     * @memberof AppOrgSelect
     */
    public created() {
        if (!this.filter) {
            this.loadTreeData(this.url);
        }
    }

    /**
     * 加载树数据
     *
     * @memberof AppOrgSelect
     */
    public initBasicData() {
        // 计算出过滤值
        if (this.filter) {
            if (this.data && this.data[this.filter]) {
                return this.data[this.filter];
            } else if (this.context && this.context[this.filter]) {
                return this.context[this.filter];
            } else {
                return null;
            }
        }
    }

    /**
     * 计算选中值
     *
     * @memberof AppOrgSelect
     */
    public computedSelectedData() {
        // 单选
        if (!this.multiple) {
            if (this.fillMap && Object.keys(this.fillMap).length > 0) {
                let templateValue = {};
                Object.keys(this.fillMap).forEach((item: any) => {
                    if (this.data && this.data[this.fillMap[item]]) {
                        Object.assign(templateValue, { [item]: this.data[this.fillMap[item]] });
                    }
                });
                this.selectTreeValue = JSON.stringify([templateValue]);
            }
        } else {
            // 多选
            if (this.fillMap && Object.keys(this.fillMap).length > 0) {
                let tempArray: Array<any> = [];
                Object.keys(this.fillMap).forEach((item: any) => {
                    if (this.data && this.data[this.fillMap[item]]) {
                        let tempDataArray: Array<any> = this.data[this.fillMap[item]].split(',');
                        tempDataArray.forEach((tempData: any, index: number) => {
                            if (tempArray.length < tempDataArray.length) {
                                let singleData: any = { [item]: tempData };
                                tempArray.push(singleData);
                            } else {
                                Object.assign(tempArray[index], { [item]: tempData });
                            }
                        });
                    }
                });
                this.selectTreeValue = JSON.stringify(tempArray);
            }
        }
    }

    /**
     * 加载树数据
     *
     * @memberof AppOrgSelect
     */
    public loadTreeData(requestUrl: string) {
        if (this.filter) {
            const result: any = this.$store.getters.getCopyData(this.filter);
            if (result) {
                this.NodesData = result;
                return;
            }
        }
        Http.getInstance()
            .get(requestUrl)
            .then((res: any) => {
                if (!res.status && res.status !== 200) {
                    console.error(this.$t('components.appOrgSelect.loadFail') as string);
                    return;
                }
                this.NodesData = res.data;
                if (this.filter) {
                    this.$store.commit('addOrgData', { srfkey: this.filter, orgData: res.data });
                }
            });
    }

    /**
     * 树选择触发事件
     *
     * @memberof AppOrgSelect
     */
    public treeSelectChange($event: any) {
        // 多选
        if (this.multiple) {
            if (!Object.is($event, '[]')) {
                const tempValue: any = JSON.parse($event);
                if (this.fillMap && Object.keys(this.fillMap).length > 0) {
                    Object.keys(this.fillMap).forEach((item: any) => {
                        let tempResult: any = '';
                        tempValue.forEach((value: any, index: number) => {
                            tempResult += index > 0 ? `,${value[item]}` : `${value[item]}`;
                        });
                        this.emitValue(this.fillMap[item], tempResult);
                    });
                }
            } else {
                if (this.fillMap && Object.keys(this.fillMap).length > 0) {
                    Object.keys(this.fillMap).forEach((item: any) => {
                        this.emitValue(this.fillMap[item], null);
                    });
                }
            }
        } else {
            // 单选
            if (!Object.is($event, '[]')) {
                const tempValue: any = JSON.parse($event)[0];
                if (this.fillMap && Object.keys(this.fillMap).length > 0) {
                    Object.keys(this.fillMap).forEach((item: any) => {
                        this.emitValue(this.fillMap[item], tempValue[item]);
                    });
                }
            } else {
                if (this.fillMap && Object.keys(this.fillMap).length > 0) {
                    Object.keys(this.fillMap).forEach((item: any) => {
                        this.emitValue(this.fillMap[item], null);
                    });
                }
            }
        }
    }

    /**
     * 抛值
     *
     * @memberof AppOrgSelect
     */
    public emitValue(name: string, value: any) {
        this.$emit('select-change', { name: name, value: value });
    }
}
</script>

<style lang="less">
@import './app-org-select.less';
</style>
